*{
    margin: 0;
    padding: 0;
    span{
        font-family :"宋体";
        font-size:12px;
    }
    a{
        text-decoration: none; 
        font-family :"宋体";
        font-size:12px;       
        color:#808080;
    }
    li{
        list-style: none;
    }
}
.allcategory{   
            text-align: center;
            color: #FFF;
            font-size: 17px;
            font-family: "Microsoft Yahei";
            float:left;
            background:#B81C22;
}
//公共头部
#top{
    width: 100%;
    height:31px;
    background:#f7f7f7 ;   
    .nr{
       width:1200px;
       margin: 0 auto;
       height:32px;
//     border:1px solid red;  
//顶部左侧     
       .left{
           float: left;
           width:600px;
           height:32px;
//         border:1px solid red;
            
           .welcome{
               float:left;
               width:136px;
               line-height: 32px;               
              
           }
           .login{
               width:90px;
               height:32px;
               float:left;
               color:#808080;
               a{
                   margin-left:6px;
                   margin-right:8px;
                   line-height: 32px;               
               }
           }
           li{
               margin-right: 15px;
               float:left;
               a{
                   line-height: 32px; 
                  
               }
              a.red{
                   color:#b81c22;
               }
               a:hover{
                    color:#b81c22; 
               }
           }
       }
//     顶部右侧
       .right{
           width:595px;
           float:right;
           li{
               margin-right:13px;
               float:left;
//             border: 2px solid #AA0000;
                a{width:50px;height:32px;display: block;
                     line-height: 32px; 
                    margin-right:6px;
                     float:left;
                    
                     &:hover{
                         color:#D43F3A;
                        }
                     
                    }
                  
                
                span.ico{ 
                   line-height: 32px; 
                   position: relative;top:16px;
                   float:left;
                   width:9px;
                   height:6px;
//                 border: 2px solid #AA0000;
                   display:block;
                   background: url('./../images/vanlebeijng.png') no-repeat -4px -6px;
               }
               span.mobel{
                   position: relative;top:8px;
                   float:left;
                   width:9px;
                   height:16px;
                  background: url('./../images/vanlebeijng.png') no-repeat -1px -28px; 
               }
               span.kefu{
                   position: relative;top:8px;
                   float:left;
                   width:16px;
                   height:16px;
                  background: url('./../images/customer_2.png') no-repeat 0 0; 
               }
              
           } 
             .fanke{
                        border:1px solid #f7f7f7;
                        
                         position:relative;
                         &:hover{
                             height:55px;
                             border:1px solid #D43F3A;
                             border-radius: 5px;
                             .erji{
                                 display:block;
                             }
                         }
                         .erji{ 
                             width:64px;height:25px;display:none;
                             
                             background:#f7f7f7;
                             z-index: 2;
                               position:absolute;left:0; top:30px;
                                }   
                    }
           span.weixin{
                   float:left;
                   position: relative;top:8px;
                   margin-right:4px;
                   float:left;
                   width:16px;
                   height:16px;
                  background: url('./../images/w1.jpg') no-repeat 0 0; 
               }
               span.weibo{
                   float:left;
                   position: relative;top:8px;
                   float:left;
                   width:16px;
                   height:16px;
                  background: url('./../images/w2.jpg') no-repeat 0 0; 
               }
       }
    }
}
//搜索
#search{
    width:100%;
    .search{
        width:1200px;
        height:90px;
//      background:#FF0000;
        margin:0 auto;
        position:relative;
//      搜索左侧开始
        .left{
            width:166px;
            height:48px;
            position:absolute;left:36px;top:21px;
            background:url(./../images/vanclsprite.png)no-repeat 0 -60px ;
        }
//      搜索框
        .mid{
            width:440px;
            height:58px;
            position:absolute;right:140px;top:27px;
            form{
                width:438px;
                height:30px;
                border:1px solid #D5D5D5;
                input{
                    height:28px;
                    border: none;
                   float:left;
                }
                .text{
                     width:380px;
                }
                .btn{
                    width:58px;
                    height:30px;
                    background:#B81C22;
                    color: white;
                }
            }
            p{
                span{
                    padding-left: 20px;
                }
            }
        }
//      购物车
        .cart{width:108px;
                height:29px;
               position:absolute;right:20px;top:27px;
              
                &:hover{
                    .top{
                        border-left:1px solid #B81C22;
                        border-right:1px solid #B81C22;
                        border-top:1px solid #B81C22;
                        height:30px;
                       
                        z-index: 2;
                background:white url(./../images/vanclsprite.png) no-repeat -153px -29px; 
                span{
                    color:red;
                }
                
                }
                p{
                    display:block;
                }
                }
            .top{width:108px;
                height:29px;
                color: white;
                position:absolute;right:0px;top:0px;
                background:url(./../images/vanclsprite.png) no-repeat -153px 0px; 
                span{
                    margin-left:30px;
                    line-height: 29px;                  
                }
               
            } 
            p{
                    display:none;
                    width:300px;
                    height:30px;
                    padding-left:15px;
                    border:1px solid #B81C22;
                    color: #000000;
                    padding-top:6px;
                    background:white;
                    position:absolute;right:0px;top:30px;
                    
                }
            
            
    }
    }
    
}
//导航条
#nav{
    width:100%;
    .nav{
        width:1200px;
        height:50px;
        margin:0 auto;
        .left{
             width:260px;
            height:50px;
            line-height: 49px;
//          全部分类样式
           .allcategory;
        }
        .right{
            width:940px;
            float:left;
            position:relative;
            li{
                float:left;
                .tab{
                display: none;
                width:939px;
                height:178px;
                background:white;
                border-left:1px solid #D0D6D9;
                border-right:1px solid #D0D6D9;
                border-bottom:2px solid #D43F3A;
                position:absolute;left:-1px;top:50px;
                z-index: 2;
                    .tableft{
                        width:468.5px;
                        height:158px;
                        margin-top:10px;
                        border-right:1px solid #D1D3D2;
                        float:left;
                        .le{
                           width:200px;height:158px;
                           float:left;
                           .img{
                            display:block;
                                img{
                                width:140px;height:140px;
                                margin-left:50px;
                                    }
                            }
                        }
                        .re{
                            width:260px;
                            float:left;
                            &>.kuan{
                                width:140px;
                                color: #727171;
                                font-size: 16px;
                                display:block;
                                font-weight: 700;
                                margin:10px;
                                float:left;
                                 }
                            &>.word{
                                float:left;
                                margin:10px;
                            }
                            &>.price{
                                float:left;
                                color: #D43F3A;
                                font-size: 18px;
                                margin:10px;
                            }
                        }
                        
                        
                    }
                }
            }
            li>a{
                width:117.5px;
                height:50px;    
                 line-height:50px;          
                background-color: #EFEFEF;
                color: #727171;
                display: block;
                font-family: "Microsoft Yahei";                              
                font-size: 16px;
                font-weight: 400; 
                text-align: center;              
            }
            li>a:hover{
                background: #E5E6E6;
                color:#B81C22;
                
            }
            
            
        }

}
}
//大区域
#big{
     width:100%;
    .big{
        width:1200px;
        height:493px;
        margin:0 auto;
        .left{
            width:260px;
            height:476px;
            float:left;
            dd{               
                width:258px;
                height:61px;
                border-bottom:1px solid #DFDFDF;
                float:left;
            }
            
           p{margin-top:-10px;}
           
           a{
              line-height:22px;
              
           }
           a.top{
               color: #A3A2A2;
                font-family: "Microsoft Yahei";
                font-size: 14px;
           }
           a.one{
               color:#B81C22;
           }
           a:hover{
               color:#B81C22;
           }
           li{
              padding-left: 35px;
                }
            .man{
                width:258px;
                height:260px;
                margin-top:17px;
                border-top:1px solid #DFDFDF;
                border-left:1px solid #DFDFDF;
                border-right:1px solid #DFDFDF;
                float:left;
                span{
                   width:28px;
                   background:white;
//                 border:1px solid red;
                   line-height: 14px;
                   display: block;
                   padding-left:5px;
                    color: #B81C22;
                    font-family: "宋体";
                    font-size: 14px;
                    font-weight: 400;
                   position: relative;left:35px;top:-7px;                   
                }
                
               
            }
           .women{
               width:258px;
                height:137px;
                margin-top:17px;
                border:1px solid #DFDFDF;
                float:left; 
                span{
                   width:28px;
                   background:white;
//                 border:1px solid red;
                   line-height: 14px;
                   display: block;
                   padding-left:5px;
                    color: #B81C22;
                    font-family: "宋体";
                    font-size: 14px;
                    font-weight: 400;
                   position: relative;left:35px;top:-7px;                   
                }               
           }
           .Shoes{
               width:258px;
                height:45px;
                margin-top:17px;
                 border:1px solid #DFDFDF;
                float:left;
                span.title{
                   width:120px;
                   background:white;
                   line-height:14px;
                   display: block;
                   padding-left:5px;
                   color: #B81C22;
                   font-family: "宋体";
                   font-size: 14px;
                   font-weight: 400;
                   position: relative;left:35px;top:-7px;                   
                }
           }
        }
        .middle{
            width:715px;
            height:475px;
            margin: 17px 6px 0 6px;
            position:relative;
            float:left;
//          border:1px solid blue;
            &>img{width:715px;
                height:475px;
                position: absolute;
                top: 0;
                left: 0;
                display: none;
               
                }
            &>ul {
                position: absolute;
                top: 428px;
                left: 301px;
                &>li{
                    float: left;
                    list-style: none;
                    width: 18px;
                    height: 18px;
                    border-radius: 50%;
                    background: #414141;
                    font-size: 12px;
                    text-align: center;
                    line-height: 18px;
                    color: white;
                    margin-right: 4px;
                }
            
            }
        }
        .right{
            margin-top: 15px;
            width:210px;
            height:478px;
            border:1px solid #DFDFDF;
             float:right;
            img.ycxt{
                  border-bottom:1px solid #DFDFDF;
            }
        }
    }
}
//当季推荐
#now_recomen{
     width:100%;
    .now_recomen{
        width:1200px;
        height:520px;
//      background:blue;
//      border:1px solid red;
        margin:0 auto;
       h2{
           color: #595757;
            font-family: "Microsoft Yahei";
            font-size: 17px;
            font-weight: 700;
            line-height: 40px;
            margin-left:36px;
            margin-top:22px;
       }
        img{
            width: 232px;
            height:232px;
            margin-right:10px;
            float:left;
            margin-bottom: 13px;
        }
        img.end{
            margin-right: 0;
          
        }
    }
    
}
//上衣
#waist{
     width:100%;
    .waist{
        width:1200px;
        height:531px;
//      background:#DD0000;
        margin:0 auto;
        h2{
             color: #595757;
            font-family: "Microsoft Yahei";
            font-size: 17px;
            font-weight: 700;
            line-height: 40px;
            margin-left:36px;
            margin-top:22px;
        }
        img.big{
            width:474px;
            
        }
         img{
            width: 232px;
            height:232px;
            margin-right:10px;
            float:left;
            margin-bottom: 13px;
        }
        img.end{
            margin-right: 0;
          
        }
        }
}
//下装
#pants{
     width:100%;
    .pants{
        width:1200px;
        height:531px;
//      background:#DD0000;
        margin:0 auto;
        h2{
             color: #595757;
            font-family: "Microsoft Yahei";
            font-size: 17px;
            font-weight: 700;
            line-height: 40px;
            margin-left:36px;
            margin-top:22px;
        }
        img.big{
            width:474px;
            
        }
         img{
            width: 232px;
            height:232px;
            margin-right:10px;
            float:left;
            margin-bottom: 13px;
        }
        img.end{
            margin-right: 0;
          
        }
        }
}
//更多精品
#more{
     width:100%;
    .more{
        width:1200px;
        height:271px;
//      background:#F0F0F0;
        margin:0 auto;
        h2{
             color: #595757;
            font-family: "Microsoft Yahei";
            font-size: 17px;
            font-weight: 700;
            line-height: 40px;
            margin-left:36px;
            margin-top:22px;
        }
         img{
            width: 232px;
            height:232px;
            margin-right:10px;
            float:left;
            margin-bottom: 13px;
        }
        img.end{
            margin-right: 0;
          
        }
    }
}
//关于凡客
#vancl{
     width:100%;
     margin-top:40px;
    
     float:left;
    .vancl{
       width:1198px;
       height:190px;
       border:1px solid #E0E0E1;
       margin:0 auto;
       
       ul{
           width:128px;
           height:138px;
           margin:27px 0 23px 70px;
           border-right:1px solid dimgrey;
         
           float:left;
            h2{
           color: #333;
            font-family: "Microsoft YaHei";
            font-size: 13px;
            font-weight: 400;
            margin-bottom: 16px;

       }
           a{
           line-height:22px;
           display:block;
           font-size:12px;
           color:#333;
           font-family: "Microsoft YaHei";}
           a:hover{
               color:#A10000;
           }
       }
       ul.end{
           border-right:none;
       }
       ul.tu{width: 1200px;height:40px;float:left;margin-top:12px;
           
                a.one{
                    width:134px;height:31px;display:block;float:left;
                    background:url(../images/vanclsprite.png)no-repeat 0 -121px;
                }
                a.two{
                    width:171px;height:31px;display:block;float:left;
                    background:url(./../images/vanclsprite.png)no-repeat 0 -162px;
                }
                a.three{
                    width:161px;height:31px;display:block;float:left;
                    background:url(./image/vanclsprite.png)no-repeat 0 -203px;
                }
                a.four{
                    width:172px;height:31px;display:block;float:left;
                    background:url(./image/vanclsprite.png)no-repeat 0 -244px;
                }
            
            
        }
    }
    div.bj{
        width:1200px;height:82px; 
       margin:0 auto;
        
        dd{
            width:300px;height:40px;float:left;
            
          
                
            a{margin:0 auto;line-height: 40px;display: block;margin-top:20px;}
            a.one{
               width:134px;height:31px;display:block;background:url(../images/vanlebeijng.png)no-repeat 0 -128px;
            }
            a.two{
                width:171px;height:31px;display:block;background:url(../images/vanlebeijng.png)no-repeat 0 -170px;
            }
            a.three{
                width:161px;height:31px;display:block;background:url(../images/vanlebeijng.png)no-repeat 0 -212px;
            }
            a.four{
                width:172px;height:31px;display:block;background:url(../images/vanlebeijng.png)no-repeat 0 -256px;
            }
        }
    }
}

//列表页开始

#chanpin{
    width:100%;
   
    .chanpin{
        width:1200px;
        margin:0 auto;
//      <!--产品瀑布流上部-->
        .top{
        width:1200px; 
        float:left; 
//      -产品瀑布流上部所有a标签样式一样
         a{
            color: #333;
            &:hover{
            color: #B81C22;
                    }
                }    
//         /<!--列表页当前位置开始-->
            .vjiaTop{
                float:left;
                width:1200px;
                height:40px;
                margin-top:20px;

                span{
                    color: #B4B4B4;
                    line-height: 40px;    
                }
               
                div{
                    float:right;
                    font-size: 12px;
                    font-family: "宋体";
                    color: #B4B4B4;
                   
                    span{
                         color: #B81C22;                            
                    }
                    
                }                                
            }
            //            分类
            .category{
                width:1198px;         
                margin:20px 0;
                float:left;
                &>li{
                    height:34px;
                    border-bottom:1px dashed #A3A2A2;
//                  border-left:1px solid #A3A2A2;
                }
                //            顶级分类
                span.topcate{
                    height:34px;width:66px;
                    line-height: 34px;
                    display:block;
//                  border-right:1px solid #A3A2A2;
                    color: #2F2F2;
                    float:left;
                    text-align: center;
                }
//              子分类 
                a{
                    float:left;
                    margin-left:15px;
                    line-height: 34px;
                    span{
                        line-height: 34px;
                        color: #B4B4B4; 
                    }
                }
            }
            .all{
                width:1200px;height:80px;
               float:left;
                margin-bottom:40px;
               p{
                   height: 40px;

                   border-bottom: 2px solid #A00002;
                   a{
                       width:110px;line-height:40px;display:block;
                       float:left;
//                     全部分类样式
                      .allcategory;
                    }                    
               }
               .table{border:1px solid #808080;
                        width:1200px;
                        height:40px;
                        border-top:none;
                    ul{
                       li{width:80px;   
                           float:left;                  
                           border-right:1px solid #656565;
                           height:40px;line-height:40px;
                           position:relative;
                           a{float:left;
                              margin:0 10px;
                              text-align: center;
                           }
                           span{float:left;
                                   display: inline-block;
                                    height: 11px;
                                    width: 11px;
                                    line-height: 40px;
                                    margin-right:10px;
 
                            }
                            

                           }
                            
                           li.input{
                               width:100px;
                               input{
                              border: 1px solid #AEB1B4;
                                height: 17px;
                                line-height:40px;
                                width: 35px;
                                padding-left: 3px;
                                float: left;
                                margin: 12px 0px 0px 0px;
                                display: inline;
                                color: #999;
                           }
                           span.input{float:left;margin-right:0px;}
                       
                             }
                             li.tiao{
                                 background:#DFDFDF;
                                 float:right;
                                 border-right:none;
                                  border-left:1px solid #656565;
                                  margin-right:0;
                                  text-align: center;
                             }
                           }
                           
               }
              
            }
        }
        ul{width:1200px;
            height:1000px;
            float:left; 
            li{
                width:231px;
                height:306.5px;
                float:left;                
                margin: 0px 11px 20px 0px;
                position: relative;
                a{
                    img{
                        width:229px;
                        height:230px;
                        float:left;
                        border:1px solid #DFDFDF;
                        &:hover{
                             border:1px solid #B81C22;
                        }
                    }                    
                }
                p{
                    width:230px;
                    line-height:43px;
                    text-align: center;
                    color: #727171;
                    font-size: 13px;
                    float:left;
                   }
                .sprice{
                    width:231px;height:20px;
                    float:left;
                    text-align: center;
                    span{
                        color: #B81C22;
                        line-height:20px;
                        font-size: 13px;
                        padding: 0px 3px 5px;
                        font-weight: 700;
                        font-family: "Microsoft YaHei";
                    }
                }
                .new{
                                width:33px;height:23px;line-height:23px;
                                position:absolute;left:0px; top:0px; background:url(../images/sprites_20130606.png)no-repeat 0 -631px;
                            }
//                          产品详图(未完)
             div.bigtu{
                 width:290px;height:480px;
                 background:#3399FF;
                 position:absolute;left:250px;height:0px;
                 z-index: 1;
//               display:block;
                 
//               img{
//                   width:272px;height:272px;
//                   position:absolute;left:10px;top:10px;
//               }
                 
             }   
            }
            li.end{
                margin: 0px 0px 20px 0px;
            }
        }
    }
}

























